我們來參考這個
https://daisyui.com/docs/install/sveltekit/?lang=en
然後在 vite.config.ts 這檔案修改以下成

import tailwindcss from "@tailwindcss/vite";
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';

export default defineConfig({
	plugins: [tailwindcss(),sveltekit()]
});

然後我們在 src 底下新增一個 app.css
內容如下

@import "tailwindcss";
@plugin "daisyui";

然後到 +layout.svelte
把 script 中間插入一行

<script lang="ts">
	import favicon from '$lib/assets/favicon.svg';
	import "../app.css"; # 插入這行
	let { children } = $props();
</script>

<svelte:head>
	<link rel="icon" href={favicon} />
</svelte:head>

{@render children?.()}

好了，我們開始嘗試用用看，DaisyUI 有沒有什麼酷酷的功能吧
我們直接到 +page.svelte
增加御三家按鈕吧

<h1>Welcome to SvelteKit</h1>
<button class="btn btn-primary">One</button>
<button class="btn btn-secondary">Two</button>
<button class="btn btn-accent btn-outline">Three</button>
<p>Visit <a href="https://svelte.dev/docs/kit">svelte.dev/docs/kit</a> to read the documentation</p>

好了，明天來做首頁導航吧，現在前端真的變得跟後端好像喔

今天的情緒抒發:

鐵人賽的程式碼區塊不能用 svelte 耶!!